<template>
	<div class="container">
		<div class="index-content">
      <div class="index-title" v-if="boo.isAuthenticate">
        <div class="top">
          <img class="logo" :src="detail.institutionLogoImgUrl ? detail.institutionLogoImgUrl : '/static/img/img-rege.png'"/>
          <span class="title">太平洋保险公司</span>
          <div class="cell">
            <img src="/static/img/u2411.png" class="icon"/>
            <span>已认证</span>
          </div>
        </div>
        <div class="bottom">
          <div class="item-text">
            <span>业务员：</span>
            <span class="right">朱丽丽</span>
          </div>
          <div class="item-text">
            <span>登录地区：</span>
            <span class="right">安徽 合肥</span>
          </div>
          <div class="item-text">
            <span>最近登录时间：</span>
            <span class="right">2019/11/19 12:09</span>
          </div>
        </div>
      </div>
      <div class="index-title" v-else>
        <div class="top">
          <img class="logo" :src="detail.institutionLogoImgUrl ? detail.institutionLogoImgUrl : '/static/img/img-rege.png'"/>
          <span class="title">太平洋保险公司</span>
          <div class="cell">
            <img src="/static/img/u2412.png" class="icon"/>
            <span>未认证</span>
          </div>
        </div>
        <div class="bottom">
          <div class="text">
            您好，太平洋保险公司，<br/>
            您还未进行实名认证，认证后即可正常使用
          </div>
          <div class="btn-container">
            <el-button class="jx-btn" type="primary" @click="gopage">立即认证</el-button>
          </div>
        </div>
      </div>
      <!-- <div class="item-content">
        <div class="list-data">
          <span class="bg">234</span>
          <span>未执行服务单数量</span>
        </div>
        <div class="list-data">
          <span class="bg">256</span>
          <span>已执行服务单数量</span>
        </div>
        <div class="list-data">
          <span class="bg">298</span>
          <span>当前待结算笔数</span>
        </div>
        <div class="list-data">
          <span class="bg">14,928.00</span>
          <span>当前待结算金额</span>
        </div>
        <div class="list-data">
          <span class="bg">298.00</span>
          <span>可用余额（元）</span>
        </div>
        <div class="list-data">
          <span class="bg">928.00</span>
          <span>冻结余额（元）</span>
        </div>
      </div> -->
    </div>
	</div>
</template>

<script>
	export default {
		data() {
			return {
        boo: {
          loading: false,
          isAuthenticate: false, //是否认证
        },
        https: this.$api.common.data,
        detail: {},
			}
		},
		mounted(){
      let _self = this
      _self.getList()
    },
		methods: {
      getList(){
        let _self = this
        let success = (res)=>{
          res = res.data
          if(res.retCode == 1){
            _self.boo.isAuthenticate = res.retObject.isRealname
            _self.detail = res.retObject
          }else{
            _self.$message.error(res.retMsg)
          }
        }
        _self.$axios.get(_self.https, {}, success) 
      },
      changeRow(type){
        let _self = this
        let params = {
          type: type
        }
      },
      gopage(){
        let _self = this
        let params = {
          path: '/authenticate?id=',
          query: '1'
        }
        _self.$router.push(params.path + params.query)
      },
    }
	}

</script>
<style scoped lang="sass">
  .index-content 
    padding: 20px 20px 60px
    display: flex
    justify-content: space-between
    .index-title 
      padding: 20px
      background: #f7f7f7
      // box-shadow: 0 0 5px #ccc
      min-width: 36%
      .top
        font-size: 19px
        text-align: center
        margin-top: 30px
        margin-bottom: 30px
        padding-bottom: 50px
        border-bottom: 1px solid #e4e4e4
        .logo 
          width: 120px
          height: 120px
          border-radius: 50%
          display: block
          margin: 0 auto
        .title
          font-weight: 600
          padding: 10px 0 5px
          display: inline-block
        .cell
          .icon
            width: 18px
            height: 18px
            position: relative
            top: 3px
          span
            color: #666
            font-size: 14px
      .bottom
        .item-text
          margin-bottom: 10px
          &:after
            content: ''
            display: block
            clear: both
          .right
            float: right
            width: 130px
            text-align: left
            overflow:hidden
            text-overflow:ellipsis
            white-space:nowrap  
        .text
          text-align: center
          line-height: 25px
          margin-bottom: 10px
    .item-content
      min-width: 55%
      margin-left: 30px
      display: flex
      flex-wrap: wrap 
      justify-content: flex-end
      .list-data
        width: 47%
        height: 140px
        margin-bottom: 20px
        margin-right: 20px
        background: #f7f7f7
        &:nth-child(2n) 
          margin-right: 0
        &:last-child
          margin-bottom: 0
        &:nth-child(5)
          margin-bottom: 0
        .bg  
          font-size: 35px
          font-weight: 600
          margin: 30px auto 0
          color: #333
        span 
          display: block
          text-align: center
          color: #999
</style>
